<{include file="public/header.html"}> 
	<header class="title title-border-sm bj-white">
            <a href="<{eval url('account/security')}>" class="icon-return iconfont title-left title-top col-red">&#xe604;</a>
		<h1 class="text-center name">交易密码</h1>
	</header>
	<form id="modify-form" class="plr15" data-href="<{eval url('ajax/ajax_modify_baseinfo')}>" onsubmit="return false;">
		<div class="input-group input-group-tip">
			<p>新交易密码</p>
			<input type="password" name="newPaypass" id="newPaypass" placeholder="6位纯数字组成" oninput="if(value.length>6)value=value.slice(0,6)" data-validate="pay" data-describedby="pay-description"/>
		</div>
		<div class="input-group input-group-tip">
			<p>确认新密码</p>
			<input type="password" name="renewPaypass" id="renewPaypass" placeholder="请再次输入新交易密码" oninput="if(value.length>6)value=value.slice(0,6)"/>
		</div>
		<div class="input-group input-group-70">
			<input type="text" name="uCode" id="uCode" maxlength="6" placeholder="输入短信验证码" oninput="if(value.length>6)value=value.slice(0,6)" data-validate="code" data-describedby="code-description" />
			<a href="javascript:;" class="send-code fr col-red bj-greyf0" id="send-code-btn">发送验证码</a>
		</div>
                <input type="submit" id="form-modify-btn" class="btn btn-yes mt10" value="确认保存"/>
	</form>
<script type="text/javascript">
var send_flag = true;
$(function(){
    var check_flag = true,check_count = 0;
    $.mvalidateExtend({
        pay:{
            required : true,   
            pattern : /\b\d{6}\b/,
            each:function(){

            },
            descriptions:{
                required : '<div class="field-invalidmsg">请输入新交易密码</div>',
                pattern : '<div class="field-invalidmsg">密码由6位纯数字组成哦</div>',
            }
        },
        code:{
            required : true,   
            pattern : /\b\d{6}\b/,
            each:function(){

            },
            descriptions:{
                required : '<div class="field-invalidmsg">请输入手机验证码</div>',
                pattern : '<div class="field-invalidmsg">请输入有效的验证码</div>',
            }
        }
    });
     $("#modify-form").mvalidate({
        type:1,
        onKeyup:true,
        sendForm:true,
        firstInvalidFocus:false,
        descriptions: {},
        valid:function(event,options){
            if($('#renewPaypass').val() != $('#newPaypass').val()){$.mvalidateTip("两次输入的密码不一致哦");return;}
            add_check_oper_listener();
            var url = $("#modify-form").attr("data-href");
            check_flag = false;
            $("#form-modify-btn").val("保存中...");
            $.ajax({
                type: "POST",
                url: url,
                async:true, 
                data: 'setType=paypass&uCode=' + $('#uCode').val()+ '&newPaypass=' + $('#newPaypass').val(),
                success: function(resp) {
                    resp = $.parseJSON(resp);
                    if(resp.reqStatus){
                        $.mvalidateTip("保存成功");
                        $("#form-modify-btn").val("确认保存");
                        $('#newPaypass').val("");$('#renewPaypass').val("");$('#uCode').val("");
                        cancel_check_oper_listener();
                    }else{
                        cancel_check_oper_listener();
                        $("#form-modify-btn").val("重新保存");
                        $.mvalidateTip(resp.errorMsg);
                        return false;
                    }
                }
            });
        },
        invalid:function(event, status, options){
            //点击提交按钮时,表单未通过验证触发函数
        },
        eachField:function(event,status,options){
            //点击提交按钮时,表单每个输入域触发这个函数 this 执向当前表单输入域，是jquery对象
        },
        eachValidField:function(val){},
        eachInvalidField:function(event, status, options){},
    })
    
    function add_check_oper_listener(){
        if(check_count == 2){
            check_count = 0;
            $.mvalidateTip("操作过于频繁");return false;
        }
        if(!check_flag){
            check_count ++;
            $.mvalidateTip("正在处理操作");return false;
        }
    };
    function cancel_check_oper_listener(){
        check_count = 0;
        check_flag = true;
    }
    
    var total_time = 60;
    
    $("#send-code-btn").on("click",function(){
        var _self = $(this);
        if(!send_flag){
            $.mvalidateTip("操作过于频繁");return;
        }
        
        var start_time = function(){
            for (var i = 1; i <= total_time; i++) {
                window.setTimeout("update_p("+ i + "," + total_time + ")", i * 1000);
            }
        }
        var send = function(){
            send_flag = false;
            $.ajax({
                type: "POST",
                url: "/ajax/send_paypass_code",
                async:true, 
                data: {aa:Math.random()},
                success: function(resp) {
                    resp = $.parseJSON(resp);
                    if(resp.reqStatus){
                        $.mvalidateTip("验证码已发送");
                        return start_time();
                    }else{
                        send_flag = true;
                        $.mvalidateTip(resp.errorMsg);
                        return;
                    }
                }
            });
        }
        send();
    });
});
var update_p = function(num,t){
    if (num == t) {
        $("#send-code-btn").text("重新获取").addClass("col-red").removeClass("col-grey999");
        send_flag = true;
    } else {
        var printnr = t - num;
        $("#send-code-btn").text("剩余"+printnr + "秒").removeClass("col-red").addClass("col-grey999");
    }
}
</script>
<{include file="public/footer.html"}> 